<template>
    <div id="my-earnings">
      <scroller lock-x scrollbar-y use-pullup  @on-pullup-loading="loadMore"  v-model="status" ref="scroller">
        <div class="box2">
          <div style="height:1rem" >
            <flexbox :gutter="0" class="vux-1px-b">
              <flexbox-item><div class="titleBox">申请时间</div></flexbox-item>
              <flexbox-item><div class="titleBox">金额</div></flexbox-item>
              <flexbox-item><div class="titleBox">状态</div></flexbox-item>
            </flexbox>
          </div>
          <load-more style="margin-top:2rem" v-if="nodatashow" :show-loading="false" :tip="'暂无记录'"></load-more>
          <div class="product-earnings" v-for="(item, index) in earningslist" :key="index">
            <flexbox class="flex-product" :class="'recordListBox'">
              <flexbox-item class="timeBox">
                <span class="typeNameBox">{{item.createTime | setData}}</span>
                <span>{{item.createTime | setTime}}</span>
              </flexbox-item>
              <flexbox-item class="monyeBox">
                {{item.cashAmt}}<span>元</span>
              </flexbox-item>
              <flexbox-item class="statusBox">
                <span>{{item.settleFlag | getStatus}}</span>
              </flexbox-item> 
            </flexbox>
          </div>
      </div>
      <div slot="pullup" class="xs-plugin-pullup-container xs-plugin-pullup-up" style="position: absolute; width: 100%; height: 40px; bottom: -40px; text-align: center;">
        <span v-show="status.pullupStatus === 'default'"></span>
        <span class="pullup-arrow" v-show="status.pullupStatus === 'up'" :class="{'rotate': status.pullupStatus === 'up'}">松开加载</span>
        <span v-show="status.pullupStatus === 'loading'"><spinner type="ios-small"></spinner></span>
      </div>
    </scroller>
  </div>
</template>
<script>
var timeStamp = String(parseInt(Number(new Date()) / 1000))
import { Flexbox, FlexboxItem, LoadMore, Scroller, Spinner } from 'vux'
import api from '../../api'
import utils from '../../utils'
export default {
  filters: {
    getStatus (value) {
      let _Status;
      if(value === "0" ||  value === 0){
        _Status = "等待提现"
      }else if(value === "1" ||  value === 1){
        _Status = "等待放款"
      }else if(value === "2" ||  value === 2){
        _Status = "审核驳回"
      }else if(value === "3" ||  value === 3){
        _Status = "完成"
      }else if(value === "4" ||  value === 4){
        _Status = "放款失败"
      }else{
        _Status = "查询无结果"
      }
      return _Status
    },
    setData(value){
      let data = value+""
      return data.split(" ")[0]
    },
    setTime(value){
      let data = value+""
      return data.split(" ")[1]
    },
  },
  data () {
    return {
      earningslist: [],
      tokenval: '',
      nodatashow: false,
      PageNum: 100,
      count: 1, // 记录页数
      downnum: 0,
      partnerid: '',
      status: {
        pullupStatus: 'default',
        pulldownStatus: 'default'
      }
    }
  },
  components: {
    Flexbox,
    FlexboxItem,
    LoadMore,
    Scroller,
    Spinner
  },
  created () {
    window.document.title = '查看提现记录'
    this.tokenval = utils.AuthToken(timeStamp, this.$store.state.userkey)
    this.apiEarnings(this.PageNum, this.downnum, this.partnerid)
    utils.jssdkwx(api, this.$wechat, this.$store)
  },
  methods: {
    apiEarnings (PageNum, downnum, partnerid) {
      var params = {
        token: this.tokenval,
        userId: this.$store.state.userID,
        timestamp: timeStamp,
        page: 1,
        perPage: PageNum
      }
      api.applymylist(params).then(res => {
        if (res.status === 200) {
          if (res.data) {
            if (res.data.list) {
              this.nodatashow = false
              this.earningslist = res.data.list;
            } else {
              this.nodatashow = true
            }
          } else {
            this.nodatashow = true
          }
          if (this.earningslist.length === 0) {
            this.nodatashow = true
          }
        }
      })
    },
    loadMore () {
      this.count ++
      this.PageNum = this.count * 10 + 100
      this.$vux.loading.show({
        text: '加载更多'
      })
      setTimeout(() => {
        this.apiEarnings(this.PageNum, this.downnum, this.partnerid)
        setTimeout(() => {
          this.$refs.scroller.donePullup()
        }, 10)
      }, 2000)
    }
  }
}
</script>
<style lang="less" rel="stylesheet/less" scoped>
@import '~vux/src/styles/1px.less';
#my-earnings{
  background:white;
}
.timeBox span {
  display: block;
  font-size: 0.32rem;
  text-align:left;
  text-indent: 0.32rem;
  color:#999999;
  padding-top:0.0rem;
}
.timeBox  span.typeNameBox {
  color:#999999;
  font-size:0.32rem;
  padding:0;
  
} 
.statusBox{
  color:#333;
  font-size:0.4rem;
  text-align:center;

}
</style>
